<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
<meta charset="UTF-8">
<title>网上党校</title>
<base href="${pageContext.request.scheme }://${pageContext.request.serverName }:${pageContext.request.serverPort }${pageContext.request.contextPath}/"/>
<link rel="stylesheet" type="text/css" href="resources/libs/reset.css">
<link rel="stylesheet" type="text/css" href="resources/css/index.css">
<script type="text/javascript" src="resources/libs/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="resources/js/index.js"></script>
<script type="text/javascript" src="resources/libs/jquery.luara.0.0.1.min.js"></script>
<script type="text/javascript" src="resources/libs/jquery.carouFredSel-6.0.4-packed.js"></script>
<script src="resources/libs/jquery.easing.1.3.js"></script>
<script src="resources/libs/jquery.scrollify.min.js"></script>

<script type="text/javascript">
$(function(){
	var newsFirstCategoryId = 1;
	var newsSecondCategoryId = 2;
	var partyNavCategoryId = 3;
	var partyRequiredCategoryId = 4;
	var lawCategoryId = 5;
	var courseCategoryId = 28032;
	var pageNumber = 1;
	var pageSize = 9;
	var articleUrl = "api/aticle/articleList";
	var courseUrl = "api/course/courseListByCategoryId";
	var courseCountUrl = "api/courseCount/findCourseCountByCourseId";
	var articleDetailUrl = "api/aticle/toDetailPage";
	var sendedData = {"categoryId":newsFirstCategoryId,"pageNumber":pageNumber,"pageSize":pageSize};
	//新闻通知
	fillNews('.news_first_label .ell','.news_first_label ul');
	sendedData.categoryId = newsSecondCategoryId;
	fillNews('.news_second_label .ell','.news_second_label ul');
	//党建知识
	sendedData.categoryId = partyRequiredCategoryId;
	sendedData.pageSize = 4;
	fillParty('.party_required ul');
	sendedData.categoryId = partyNavCategoryId;
	fillParty('.party_nav ul');
	
	$('.party .uls').on('mouseover','li',function() {
		$(this).removeClass('curr2').siblings().addClass('curr2');
		$(this).find('span').show().parent().siblings().find('span').css('display', 'none');
	});
	//法律法规
	sendedData.pageSize = 8;
	sendedData.categoryId = lawCategoryId;
	$.post(articleUrl,sendedData,function(data){
		var list = data.articleList;
		for(var i = 0; i < list.length; i++){
			$('.law ul').append('<li><a href="' + articleDetailUrl + '?articleId=' + list[i].id + '">《' + list[i].title + '》</a></li>');
		}
	},"json");
	//公开课
	sendedData.categoryId = courseCategoryId;
	$.post(courseUrl,sendedData,function(data){
		var list = data.courseList;
		for(var i = 0; i < list.length; i++){
			var $li = $('.course ul li:first').clone();
			$li.find('img').attr('src',list[i].large_img);
			$li.find('.title').text(list[i].name);
			syncAjaxPost(courseCountUrl, {"courseId":list[i].id}, function(data2){
				$li.find('i').html((data2.courseCount ? data2.courseCount.study_num : 0) + '人学习');
			});
			$li.show();
   			$('.course ul').append($li);
			$('#carousel ul').carouFredSel({
				prev: '#prev',
				next: '#next',
				scroll: 1000
			});
		}
	},"json");
	function fillNews(selector1,selector2){
		$.post(articleUrl,sendedData,function(data){
			var list = data.articleList;
			$(selector1).text(list[0].title);
			for ( var i = 1; i < list.length; i++) {
				$(selector2).append('<li><a href="' + articleDetailUrl + '?articleId=' + list[i].id + '">' + list[i].title + '</a></li>');
			}
			$(selector2).append('<li class="more1"><a href="">更多</a></li>');
		}, "json");
	}
	function fillParty(selector){
		$.post(articleUrl,sendedData,function(data){
			var list = data.articleList;
			$(selector).append('<li><a href="' + articleDetailUrl + '?articleId=' + list[0].id + '" class="ell">'+ list[0].title +'</a> <span>'+ (list[0].digest ? list[0].digest : '暂无') +'</span></li>');
			for(var i = 1; i < list.length; i++){
				$(selector).append('<li class="curr2"><a href="' + articleDetailUrl + '?articleId=' + list[i].id + '" class="ell">'+ list[i].title +'</a> <span style="display: none;">'+ (list[i].digest ? list[i].digest : '暂无') +'</span></li>');
			}
		},"json");
	}
});
function syncAjaxPost(url, sendedData, fun) {
		$.ajax({
			type : "POST",
			url : url,
			data : sendedData,
			async : false,
			success: function(receiveData) {
				fun(receiveData);
			}
		});
	}
</script>
</head>
<body>
	<!-- 头部 -->
	<div class="header panel">
		<h1></h1>
		<div class="btn clearfix">
			<a href="javascript:;" class="dq"></a> <a href="javascript:;"
				class="dh"></a> <a href="javascript:;" class="sc"></a> <a
				href="javascript:;" class="dg"></a>
		</div>
		<img src="resources/img/gezi.png" alt="" class="gezi">
	</div>
	<!-- 导航条 -->
	<div class="nav panel">
		<img src="resources/img/logo_dx.png" alt="">
		<div class="nav_box clearfix">
			<a href="" class="nav_bak">首页</a> <a href="">新闻通知</a> <a href="">党建知识</a> <a href="">理论之窗</a>
			<a href="">法律法规</a> <a href="">入驻支部</a> <a href="">公开课</a> <a href="">关于我们</a>
		</div>
	</div>
	<!-- 内容 -->
	<div class="content">
		<div class="content_xwtz">
			<h3>
				<img src="resources/img/logo1.png" alt="">
			</h3>
			<div class="btn clearfix">
				<a href="javascript:;" class="l curr">党政要闻</a> <a
					href="javascript:;" class="r">网校动态</a>
			</div>
			<div class="box news">
				<div class="lists news_first_label clearfix">
					<div class="img l">
						<img src="resources/img/img1.jpg" alt="">
						<p class="ell"></p>
					</div>
					<ul class=" r"></ul>
				</div>
				<div class="lists news_second_label clearfix hide">
					<div class="img l">
						<img src="resources/img/img1.jpg" alt="">
						<p class="ell"></p>
					</div>
					<ul class=" r"></ul>
				</div>
			</div>
		</div>
		<div class="content_djzs">
			<h3>
				<img src="resources/img/logo2.png" alt="">
			</h3>
			<div class="lists_box party clearfix">
				<div class="lists party_required l">
					<div class="top clearfix">
						<h5>入党必读</h5>
						<a href="">更多</a>
					</div>
					<ul class="uls"></ul>
				</div>
				<div class="lists party_nav r">
					<div class="top clearfix">
						<h5>入党导航</h5>
						<a href="">更多</a>
					</div>
					<ul class="uls"></ul>
				</div>
			</div>
		</div>
		<div class="content_llzc">
			<h3>
				<img src="resources/img/logo3.png" alt="">
			</h3>
			<div class="tu clearfix">
				<div class="bigP">
					<img src="resources/img/xi.jpg" alt="">
					<div>
						<a href="">毛泽东思想</a> <span>毛泽东思想是马克思列宁主义在中国的运用和发展，是被实践证明了的关于中国革命和建设的正确的理论原则和经验总结，是中国共产党集体智慧的结晶。</span>
					</div>
				</div>
				<div class="smallP">
					<img src="resources/img/mao.jpg" alt="">
					<div>
						<a href="">毛泽东思想</a>
					</div>
				</div>
				<div class="smallP">
					<img src="resources/img/deng.jpg" alt="">
					<div>
						<a href="">毛泽东思想</a>
					</div>
				</div>
				<div class="smallP">
					<img src="resources/img/jiang.jpg" alt="">
					<div>
						<a href="">毛泽东思想</a>
					</div>
				</div>
				<div class="smallP">
					<img src="resources/img/hu.jpg" alt="">
					<div>
						<a href="">毛泽东思想</a>
					</div>
				</div>
			</div>
		</div>
		<div class="content_flfg">
			<h3>
				<img src="resources/img/logo4.png" alt="">
			</h3>
			<div class="lists law clearfix">
				<ul class="l"></ul>
				<div class="example2 r">
					<ul>
						<li><img src="resources/img/img2.jpg" alt="1" />
						</li>
						<li><img src="resources/img/img2.jpg" alt="2" />
						</li>
						<li><img src="resources/img/img2.jpg" alt="3" />
						</li>
						<li><img src="resources/img/img2.jpg" alt="4" />
						</li>
					</ul>
					<ol>
						<li></li>
						<li></li>
						<li></li>
						<li></li>
					</ol>
				</div>
			</div>
			<a href="" class="banner"></a>
		</div>
		<div class="content_gkk">
			<h3>
				<img src="resources/img/logo5.png" alt="">
			</h3>
			<div id="wrapper">
				<div id="carousel" class="wrapBox course">
					<ul class="count">
						<li style="display:none;"><img src="resources/img/img3.jpg" onerror="this.src='resources/img/img3.jpg'" alt="">
							<div>
								<p class="title ell"></p>
								<p class="msg clearfix">
									<span>富媒体</span><i></i>
								</p>
							</div></li>
					</ul>
					<a id="prev" class="prev btn" href="#"></a> <a id="next"
						class="next btn" href="#"></a>
					<!-- <div id="pager" class="pager"></div> -->
				</div>
			</div>
		</div>
	</div>
	<!-- 尾部 -->
	<div class="footer">
		<div>
			<p>
				<a href="">关于我们</a><a href="">友情链接</a><a href="">联系我们</a>
			</p>
			<p class="clearfix">
				<span class="l">Copyright © 2016</span><span class="r">京ICP备88888888号</span>
			</p>
		</div>
	</div>
</body>
</html>